<template>
	<view class="container">

		<view class="intro">本项目已包含uni ui组件，无需import和注册，可直接使用。在代码区键入字母u，即可通过代码助手列出所有可用组件。光标置于组件名称处按F1，即可查看组件文档。</view>
		<text class="intro">详见：</text>
		<uni-link :href="href" :text="href"></uni-link>
		<uni-list>
			<block v-for="(item, index) in list" :key="item.id">
				<uni-list-item :title="item.name" link :to="geturl(item.id)" ></uni-list-item>
			</block>

<!-- 			<uni-list-item title="默认 navigateTo 方式跳转页面" link to="/pages/vue/index/index"
				></uni-list-item>
			<uni-list-item title="reLaunch 方式跳转页面" link="reLaunch" to="/pages/vue/index/index"
				></uni-list-item> -->
		</uni-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				href: 'https://uniapp.dcloud.io/component/README?id=uniui',
				list: [{
					id: 'uBadge',
					name: '数字角标'
				}, {
					id: 'uBreadcrumb',
					name: '面包屑'
				}, {
					id: 'uCalendar',
					name: '日历'
				}, {
					id: 'uCard',
					name: '卡片'
				}, {
					id: 'uCollapse',
					name: '折叠面板'
				}, {
					id: 'uCombox',
					name: '组合框'
				}, {
					id: 'uCountDown',
					name: '倒计时'
				}, {
					id: 'uDataCheckbox',
					name: '数据选择器'
				}, {
					id: 'uDataPicker',
					name: '级联选择器'
				},{
					id:'uDataSelect',
					name:'下拉框'
				},{
					id:'uDateformat',
					name:'日期格式化'
				},{
					id:'uDatetimePicker',
					name:'日期选择器'
				},{
					id:'uDrawer',
					name:'抽屉'
				},{
					id:'uEasyinput',
					name:'增强输入框'
				},{
					id:'uFab',
					name:'悬浮按钮'
				},{
					id:'uFav',
					name:'收藏按钮'
				},{
					id:'uFilePicker',
					name:'文件选择上传'
				},{
					id:'uForms',
					name:'表单'
				},{
					id:'uGoodsNav',
					name:'商品导航'
				},{
					id:'uGrid',
					name:'宫格'
				},{
					id:'uGroup',
					name:'分组'
				},{
					id:'uIcons',
					name:'图标'
				},{
					id:'uIndexedList',
					name:'索引列表'
				},{
					id:'uLink',
					name:'超链接'
				},{
					id:'uList',
					name:'列表'
				},{
					id:'uLoadMore',
					name:'加载更多'
				},{
					id:'uNavBar',
					name:'自定义导航栏'
				},{
					id:'uNoticeBar',
					name:'通告栏'
				},{
					id:'uNumberBox',
					name:'数字输入框'
				},{
					id:'uPagination',
					name:'分页器'
				},{
					id:'uPopup',
					name:'弹出层'
				},{
					id:'uRate',
					name:'评分'
				},{
					id:'uRow',
					name:'布局-行'
				},{
					id:'uSearchBar',
					name:'搜索栏'
				},{
					id:'uSection',
					name:'标题栏'
				},{
					id:'uSegmentedControl',
					name:'分段器'
				},{
					id:'uSteps',
					name:'步骤条'
				},{
					id:'uSwipeAction',
					name:'滑动操作'
				},{
					id:'uSwiperDot',
					name:'轮播图指示点'
				},{
					id:'uTable',
					name:'表格'
				},{
					id:'uTag',
					name:'标签'
				},{
					id:'uTitle',
					name:'章节标题'
				},{
					id:'utooltip',
					name:'文字提示'
				},{
					id:'uTransition',
					name:'过渡动画'
				}]
			}
		},
		methods: {
			geturl(e){
				const url = '/pages/component/' + e + '/' + e
				return url
			},
			// goDetailPage(e) {
			// 	const url = '/pages/component/' + e + '/' + e
			// 	uni.navigateTo({
			// 		url: url
			// 	})
			// }
		}
	}
</script>

<style>
	.container {
		padding: 20px;
		font-size: 14px;
		line-height: 24px;
	}
</style>